<template>
  <div class="app-container"  v-loading="loading">
<!--    sectionInfo:{{sectionInfoId}}-->

    <el-tabs v-model="activeName" class="demo-tabs" type="border-card" @tab-click="handleClick">
      <el-tab-pane :label="warnSectionInfo.sectionName" name="first">

        <el-table v-loading="loading" :data="warnAnalysisPeakList" @selection-change="handleSelectionChange">
          <!--      <el-table-column type="selection" width="55" align="center" />-->
          <el-table-column label="流水号" align="center" prop="id" v-if="false"/>
          <!--      <el-table-column label="线路标识" align="center" prop="lineId">
                  <template #default="scope">
                    <dict-tag :options="line_info" :value="scope.row.lineId"/>
                  </template>
                </el-table-column>
                <el-table-column label="光纤通道编号" align="center" prop="fiberNum">
                  <template #default="scope">
                    <dict-tag :options="fiber_info" :value="scope.row.fiberNum"/>
                  </template>
                </el-table-column>-->
          <!--      <el-table-column label="分段区域的编号" align="center" prop="warnSectionNo" />-->
          <el-table-column label="预警编号" align="center" prop="warnNo" />
          <!--      <el-table-column label="预警接口保存表id" align="center" prop="apiId" />-->
          <el-table-column :label='`最大值(${unit})`' align="center" prop="maxValue" width="90px"/>
          <el-table-column label="最大值管道位置" align="center" prop="maxDistance" width="120px"/>
          <el-table-column label="最大值光纤位置" align="center" prop="maxFiberDistance" width="120px"/>
          <el-table-column :label='`最小值(${unit})`' align="center" prop="minValue" width="90px"/>
          <el-table-column label="最小值管道位置" align="center" prop="minDistance" width="120px"/>
          <el-table-column label="最小值光纤位置" align="center" prop="minFiberDistance" width="120px"/>
          <el-table-column :label='`均值(${unit})`' align="center" prop="meanValue" width="120px"/>
                <el-table-column label="检测时间" align="center" prop="createTime" />
          <!--      <el-table-column label="中值" align="center" prop="medianValue" />-->
          <!--      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">-->
          <!--      </el-table-column>-->
        </el-table>
      </el-tab-pane>

      <el-tab-pane v-for="(item, index) in relativeList" :key="index" :label="item.warnName" :name="item.warnNo" >
        <warn-relative :warnRAObj="item" :fiberInfo="fiberInfo"></warn-relative>
      </el-tab-pane>
<!--      <el-tab-pane label="{{warnSectionInfo.sectionName}}" name="fourth">Task</el-tab-pane>-->
    </el-tabs>
  </div>
</template>

<script setup name="SectionInfo">

import warnRelative  from '@/views/warn/warnZone/warnRelative'

const { proxy } = getCurrentInstance();
import {getWarnSectionInfoZone} from '@/api/warn/warnZone'
import WarnRelative from "./warnRelative";
const { warn_his_status, line_info, fiber_info } = proxy.useDict('warn_his_status', 'line_info', 'fiber_info');
const route = useRoute();

const loading = ref(true);

const sectionInfoId = ref(route.params && route.params.siId)
const activeName = ref('first')
const relativeList = ref([])
const warnAnalysisPeakList = ref([])
const hostInfo = ref({})
const lineInfo = ref({})
const fiberInfo = ref({})
const warnSectionInfo = ref({})
const unit = ref("")

const warnNoData = ref({})

function handleClick(tab, event) {
  console.log(tab, event)
}

function init() {
  doGetWarnSectionInfoZone()
}

function doGetWarnSectionInfoZone(){
  let params = {warnType:1, sectionId: sectionInfoId.value}
  loading.value = true;
  getWarnSectionInfoZone(params).then(resp=>{
    if (resp.code === 200) {
      hostInfo.value = resp.data.hostInfo;
      lineInfo.value = resp.data.lineInfo;
      fiberInfo.value = resp.data.fiberInfo;
      warnSectionInfo.value = resp.data.warnSectionInfo;
      relativeList.value = resp.data.relativeList;
      warnAnalysisPeakList.value = resp.data.lastPeakList
      if (fiberInfo && fiberInfo.value) {
        if (fiberInfo.value.channelModel === '1') {
          unit.value = "℃"
        } else if (fiberInfo.value.channelModel === '2') {
          unit.value = "ue"
        } else {
          unit.value = ''
        }
      }
      /*if (resp.data.relativeList && resp.data.relativeList.length > 0 ) {
        warnNoData.value = resp.data.relativeList[0]

      }*/
    } else {
      proxy.alert(resp.msg);
    }
    loading.value = false;
  })

}


init();
</script>

<style scoped>

</style>
